<template>
  <view>
    <img src="@/assets/banner.png" style="width: 100%;height: 100%;margin-bottom: 30px" />
    <view style="padding: 20px; background: white;">
	  <u-field
	  	v-model="mobileNo"
	  	label="手机号码"
	  	placeholder="请输入手机号码"
	  />
	<view class="uni-input-wrapper">
		<u-field
			v-model="validateCode"
			label="验证码"
			placeholder="请填写验证码"
		>
			<u-button @click="getValidateCode()" slot="right" size="mini" type="success">{{ countStr }}</u-button>
		</u-field>
	</view>
      <view style="display:flex;align-items:center;margin-top: 10px; font-size: 13px;">
        <radio style="width: 25px; margin-right: 10px;"/>
        <text>我已阅读并同意用户协议并授权商城使用账号信息进行统一管理</text>
      </view>
      <button @click="login" style="margin-top: 30px;border-radius: 30px" size="large" type="primary">登录</button>
    </view>
     <view class="url-bottom" @click="gotoUrl">
      工业和信息化部备案管理 湘ICP备2024086101号
    </view>
  </view>
</template>

<script>
import { getCode, login } from '@/api/login.js';
export default {
  data() {
    return {
      mobileNo: '',
      validateCode:'',
      countStr: '获取验证码'
    }
  },
  created() {
    // const isLogin = window.localStorage.getItem('isLogin')
    // if (isLogin == 'true') {
    //   this.$router.push('/main');
    // }
  },
  methods: {
    async getValidateCode () {
	const res = await getCode({ mobileNo: this.mobileNo })
		if (res.status === '2000') {
                Toast.success('发送成功')
                let count = 60
                let timer = setInterval(() => {
                  this.countStr = `剩余${count --}s`
                  if (count === 0) {
                    this.countStr = '获取验证码'
                    clearInterval(timer)
                  }
                }, 1000)
              } 
    },
    async login() {
      const res = await login({ mobileNo: this.mobileNo, validateCode: this.validateCode });
      window.localStorage.setItem('user', JSON.stringify(res.data))
      window.localStorage.setItem('token', res.data.token)
      window.localStorage.setItem('isLogin', 'true')
	  uni.navigateTo({
	  	url: '/pages/main/index'
	  })
    },
    gotoUrl() {
      window.location.href = 'http://beian.miit.gov.cn/';
    }
  }
};
</script>
<style lang="scss" scoped>
.url-bottom {
  padding: 5px 10px;
  margin-top: 10px;
  text-align: center;
  position: absolute;
  bottom: 0px;
}
</style>